//关注
.mid-hav {
    display: flex;
    margin: 0 64rpx;
    height: 1388rpx;
    height: 100%;
    flex-direction: column;

    .content1 {
        display: flex;
        margin-top: 20rpx;
        background: #f0f0f0;
        margin-bottom: 20rpx;
        height: 472rpx;
        border-radius: 20rpx;
        box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
        flex-direction: column;

        .hav1 {
            display: flex;
            margin-top: 48rpx;
            width: 100%;
            height: 76rpx;

            .img-path {
                display: flex;
            }

            .imag {
                display: flex;
                margin-left: 56rpx;
                width: 76rpx;
                height: 76rpx;

                .image1 {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    /* 保持图片比例并填充整个区域 */
                    border-radius: 50%;
                    /* 让图片呈现圆形 */
                }
            }

            .hu {
                display: flex;
                margin-top: 3rpx;
                width: 144rpx;
                height: 100%;
                flex-direction: column;

                .name {
                    display: flex;
                    width: 130rpx;
                    height: 30rpx;
                    justify-content: center;
                    align-items: center;
                    font-size: 24rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #000000;
                    line-height: 28rpx;
                    text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
                }
            }

            .it {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 142rpx;
                height: 30rpx;
                font-size: 20rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                color: #c0bfbf;
                text-align: CENTER;
                line-height: 24rpx;
                text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }

            .cz {
                display: flex;
                margin-left: 200rpx;
                width: 100rpx;
                height: 40rpx;
                justify-content: center;
                background: #f2bb16;
                border-radius: 20rpx;
                box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);

                .button {
                    display: flex;
                    margin-top: 3rpx;
                    margin-bottom: 4rpx;
                    width: 80rpx;
                    height: 36rpx;
                    justify-content: center;
                    align-items: center;
                    font-size: 24rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #ffffff;
                    line-height: 28rpx;
                }

            }
        }

        .tag {
            display: flex;
            flex-direction: row;
            margin-left: 58rpx;
            margin-top: 32rpx;
            width: 384rpx;
            height: 38rpx;

            .tag1 {
                display: flex;
                width: 180rpx;
                height: 38rpx;
                font-size: 24rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: center;
                color: #f2bb16;
                line-height: 28rpx;
                text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);

            }

            .tag2 {
                display: flex;
                width: 204rpx;
                height: 38rpx;
                font-size: 24rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: center;
                color: #000000;
                line-height: 28rpx;
                text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }

        }

        .ims {
            display: flex;
            margin-top: 20rpx;
            margin: 0 66rpx;
            height: 120rpx;

            .ims2 {
                display: flex;
                width: 132rpx;
                height: 120rpx;
                margin-right: 51rpx;
                background: #ffffff;
                border-radius: 20rpx;
                box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25), 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }


        }

        .fen {
            display: flex;
            width: 180rpx;
            height: 36rpx;
            margin-top: 26rpx;
            margin-left: 66rpx;
            background: #d9d9d9;
            border-radius: 30rpx;
            box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
        }

        .ove {
            display: flex;
            margin-left: 58rpx;
            margin-top: 20rpx;
            flex-direction: row;
            width: 528rpx;
            height: 48rpx;

            .ove1 {
                display: flex;
                width: 430rpx;
                height: 48rpx;

                .ove2 {
                    display: flex;
                    width: 110rpx;
                    height: 48rpx;

                    &:last-child {
                        margin-right: 0;
                    }
                }

                .ove3 {
                    display: flex;
                    width: 48rpx;
                    height: 48rpx;
                }

                .ove4 {
                    display: flex;
                    width: 60rpx;
                    height: 48rpx;
                    justify-content: center;
                    align-items: center;
                    font-size: 24rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #545050;
                    line-height: 28rpx;
                    text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);

                }

            }

            .over {
                display: flex;
                width: 148rpx;
                height: 48rpx;
                justify-content: center;
                /* 水平居中 */
                align-items: center;
                /* 垂直居中 */

                .over1 {
                    display: flex;
                    width: 32rpx;
                    height: 32rpx;
                    margin-left: 30rpx;
                }
            }
        }
    }
}

.geng {
    display: flex;
    bottom: 0;
    width: 750rpx;
    height: 282rpx;
    border-top-left-radius: 40rpx;
    border-top-right-radius: 40rpx;
    flex-direction: column;

    .tops-box {
        display: flex;
        height: 84rpx;
        justify-content: center;
        align-items: center;
        font-size: 40rpx;
        font-family: Inter, Inter-700;
        font-weight: 700;
        text-align: center;
        color: #000000;
        line-height: 38rpx;
    }

    .mids-box {
        display: flex;
        height: 130rpx;
        flex-direction: row;

        .lefs-box {
            display: flex;
            height: 100rpx;
            width: 70rpx;
            margin-top: 20rpx;
            margin-left: 140rpx;
            flex-direction: column;

            .lefs-img {
                display: flex;
                margin-top: 10rpx;
                height: 60rpx;
                width: 60rpx;
            }

            .lefs-title {
                font-size: 24rpx;
                font-family: Inter, Inter-500;
                font-weight: 500;
                text-align: center;
                color: #000000;
                line-height: 28rpx;
            }

        }

        .mods-box {
            display: flex;
            height: 100rpx;
            width: 130rpx;
            margin-top: 20rpx;
            margin-left: 120rpx;
            flex-direction: column;

            .mods-img {
                display: flex;
                margin-top: 10rpx;
                height: 60rpx;
                width: 60rpx;
                margin-left: 30rpx;
            }

            .mods-title {
                font-size: 24rpx;
                font-family: Inter, Inter-500;
                font-weight: 500;
                text-align: LEFT;
                color: #000000;
                line-height: 28rpx;
            }
        }

        .regs-box {
            display: flex;
            height: 100rpx;
            width: 70rpx;
            background: #0ba4d7;
            margin-top: 20rpx;
            margin-left: 120rpx;

            .regs-img {
                display: flex;
                margin-top: 10rpx;
                height: 60rpx;
                width: 60rpx;
            }

            .regs-title {
                font-size: 24rpx;
                font-family: Inter, Inter-500;
                font-weight: 500;
                text-align: LEFT;
                color: #000000;
                line-height: 28rpx;
            }
        }
    }

    .bots-box {
        display: flex;
        background: #ffffff;
        height: 70rpx;
        width: 100%;
    }

}

// 发现
.boxmid {
    display: flex;
    flex-direction: column;
    margin-left: 64rpx;
    height: 350rpx;
    width: 628rpx;
    background: #f8d770;
    border-radius: 20rpx;

    .content11 {
        display: flex;
        height: 240rpx;
        margin-left: 40rpx;
        width: 548rpx;

        .transan {
            display: flex;
            position: absolute;
            margin-left: 60rpx;
            width: 0;
            height: 0;
            border-bottom: 25rpx solid rgb(252, 252, 252);
            border-left: 15rpx solid transparent;
            border-right: 15rpx solid transparent;
        }

        .transi {
            display: flex;
            margin-top: 22rpx;
            height: 250rpx;
            width: 548rpx;
            background: #fff;
            border-radius: 40rpx;
            flex-direction: column;

            .tr1 {
                display: flex;
                margin-top: 30rpx;
                margin-left: 60rpx;
                width: 430rpx;
                height: 42rpx;
                font-size: 32rpx;
                align-items: center;
                justify-content: center;
                text-align: center;
                color: #ba0808;
                line-height: 32rpx;


            }

            .tr11 {
                margin-left: 20rpx;
                width: 380rpx;
                height: 42rpx;
                font-size: 32rpx;
                justify-content: center;
                align-items: center;
                font-family: PingFang SC,
                    PingFang SC-500;
                font-weight: 500;
                text-align: left;
                color: #000000;
                line-height: 42rpx;
            }

            .tr2 {
                display: flex;
                flex-direction: column;
                margin-top: 10rpx;
                margin-left: 60rpx;
                width: 430rpx;
                height: 90rpx;

                .tr2-box1 {
                    display: flex;
                    margin-left: 8rpx;
                    height: 42rpx;
                    width: 430rpx;
                    color: #c29304;
                    font-size: 32rpx;
                    align-items: center;
                    text-align: left;
                    line-height: 42rpx;
                }

                .tr2-box2 {
                    margin-top: 15rpx;
                    width: 300rpx;
                    height: 24rpx;
                    margin-left: 50rpx;
                    display: flex;
                    flex-direction: row;

                    .te1 {
                        width: 124rpx;
                        height: 24rpx;
                        border-radius: 20rpx;
                        background: #f2bb16;
                        text-align: CENTER;
                        color: #ffffff;
                        font-size: 20rpx;
                        line-height: 24rpx;
                    }

                    .te2 {
                        border-radius: 20rpx;
                        margin-left: 30rpx;
                        width: 124rpx;
                        height: 24rpx;
                        font-size: 20rpx;
                        text-align: CENTER;
                        color: #ffffff;
                        line-height: 24rpx;
                        background: #949090;
                    }
                }
            }

            .tr3 {
                display: flex;
                width: 430rpx;
                margin-top: 10rpx;
                margin-left: 60rpx;
                align-items: center;
                justify-content: center;
                height: 42rpx;
                font-size: 32rpx;
                text-align: left;
                color: #f2bb16;
                line-height: 32rpx;
            }

        }

        .transi::after {
            display: flex;
            margin-left: 60rpx;
            width: 0;
            height: 0;
            border-bottom: 30rpx solid rgb(252, 252, 252);
            border-left: 15rpx solid transparent;
            /* 左边透明 */
            border-right: 15rpx solid transparent;
        }
    }

    .content22 {
        display: flex;
        height: 240rpx;
        margin-left: 40rpx;
        width: 548rpx;

        .transan2 {
            display: flex;
            position: absolute;
            margin-left: 235rpx;
            width: 0;
            height: 0;
            border-bottom: 25rpx solid rgb(252, 252, 252);
            border-left: 15rpx solid transparent;
            border-right: 15rpx solid transparent;
        }

        .transi2 {
            display: flex;
            margin-top: 22rpx;
            height: 250rpx;
            width: 548rpx;
            background: #fff;
            border-radius: 40rpx;

        }

        .transi2::after {
            display: flex;
            margin-left: 60rpx;
            width: 0;
            height: 0;
            border-bottom: 30rpx solid rgb(252, 252, 252);
            border-left: 15rpx solid transparent;
            /* 左边透明 */
            border-right: 15rpx solid transparent;
        }
    }

    .head-nav1 {
        margin-top: 20rpx;
        margin-right: 280rpx;
        margin-left: 50rpx;
        height: 40rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 32rpx;
        font-family: PingFang SC, PingFang SC-500;
        font-weight: 500;
        text-align: LEFT;
        color: #545050;
        line-height: 38rpx;

    }

    .activite1 {
        display: flex;
        color: #000000;

    }

    .head-nav1>view {
        padding-bottom: 10rpx;

    }
}

// 下半部分
.xia-box {
    display: flex;
    margin-top: 44rpx;
    top: 44rpx;
    width: 750rpx;
    // height: 3000rpx;
    height: 100%;
    background: #f0f0f0;
    flex-direction: column;

    .sticky {
        position: sticky;
        height: 60rpx;
        top: 0rpx;
        width: 750rpx;
        background: #f0f0f0;
        z-index: 999;

        .tui-box {
            display: flex;
            height: 44rpx;
            top: 0;
            // width: 750rpx;
            // margin-top: 20rpx;
            margin-right: 150rpx;
            margin-left: 65rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 32rpx;
            font-family: PingFang SC, PingFang SC-500;
            font-weight: 500;
            text-align: LEFT;
            color: #545050;
            line-height: 38rpx;
        }
    }



    .tuiIndex {
        display: flex;
        color: #000000;
        font-weight: 600;
        font-size: 36rpx;
    }

    .tui-box1 {
        display: flex;
        height: 100%;
        margin: 0 64rpx;
        flex-direction: column;
    }

    //盒子内容编辑
    .content1 {
        display: flex;
        margin-top: 20rpx;
        background: #ffffff;
        margin-bottom: 20rpx;
        width: auto;
        height: 472rpx;
        border-radius: 20rpx;
        box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
        flex-direction: column;

        .hav1 {
            display: flex;
            margin-top: 48rpx;
            width: 100%;
            height: 76rpx;

            .img-path {
                display: flex;
            }

            .imag {
                display: flex;
                margin-left: 56rpx;
                width: 76rpx;
                height: 76rpx;

                .image1 {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    /* 保持图片比例并填充整个区域 */
                    border-radius: 50%;
                    /* 让图片呈现圆形 */
                }
            }

            .hu {
                display: flex;
                margin-top: 3rpx;
                width: 144rpx;
                height: 100%;
                flex-direction: column;

                .name {
                    display: flex;
                    width: 130rpx;
                    height: 30rpx;
                    justify-content: center;
                    align-items: center;
                    font-size: 24rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #000000;
                    line-height: 28rpx;
                    text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
                }
            }

            .it {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 142rpx;
                height: 30rpx;
                font-size: 20rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                color: #c0bfbf;
                text-align: CENTER;
                line-height: 24rpx;
                text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }

            .cz {
                display: flex;
                margin-left: 200rpx;
                width: 100rpx;
                height: 40rpx;
                justify-content: center;
                background: #f2bb16;
                border-radius: 20rpx;
                box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);

                .button {
                    display: flex;
                    margin-top: 3rpx;
                    margin-bottom: 4rpx;
                    width: 80rpx;
                    height: 36rpx;
                    justify-content: center;
                    align-items: center;
                    font-size: 24rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #ffffff;
                    line-height: 28rpx;
                }

            }
        }

        .tag {
            display: flex;
            flex-direction: row;
            margin-left: 58rpx;
            margin-top: 32rpx;
            width: 384rpx;
            height: 38rpx;

            .tag1 {
                display: flex;
                width: 180rpx;
                height: 38rpx;
                font-size: 24rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: center;
                color: #f2bb16;
                line-height: 28rpx;
                text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);

            }

            .tag2 {
                display: flex;
                width: 204rpx;
                height: 38rpx;
                font-size: 24rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: center;
                color: #000000;
                line-height: 28rpx;
                text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }

        }

        .ims {
            display: flex;
            margin-top: 20rpx;
            margin: 0 66rpx;
            height: 120rpx;

            .ims2 {
                display: flex;
                width: 132rpx;
                height: 120rpx;
                margin-right: 51rpx;
                background: #ffffff;
                border-radius: 20rpx;
                box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25), 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }


        }

        .fen {
            display: flex;
            width: 180rpx;
            height: 36rpx;
            margin-top: 26rpx;
            margin-left: 66rpx;
            background: #d9d9d9;
            border-radius: 30rpx;
            box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
        }

        .ove {
            display: flex;
            margin-left: 58rpx;
            margin-top: 20rpx;
            flex-direction: row;
            width: 528rpx;
            height: 48rpx;

            .ove1 {
                display: flex;
                width: 430rpx;
                height: 48rpx;

                .ove2 {
                    display: flex;
                    width: 110rpx;
                    height: 48rpx;

                    &:last-child {
                        margin-right: 0;
                    }
                }

                .ove3 {
                    display: flex;
                    width: 48rpx;
                    height: 48rpx;
                }

                .ove4 {
                    display: flex;
                    width: 60rpx;
                    height: 48rpx;
                    justify-content: center;
                    align-items: center;
                    font-size: 24rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #545050;
                    line-height: 28rpx;
                    text-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);

                }

            }

            .over {
                display: flex;
                width: 148rpx;
                height: 48rpx;
                justify-content: center;
                /* 水平居中 */
                align-items: center;
                /* 垂直居中 */

                .over1 {
                    display: flex;
                    width: 32rpx;
                    height: 32rpx;
                    margin-left: 30rpx;
                }
            }
        }
    }

}

// 圈子
.qus {
    display: flex;
    margin: 0 64rpx;
    height: 1388rpx;
    background: #ffffff;
    flex-direction: column;

    .wo-box {
        margin-top: 30rpx;
        display: flex;
        width: 136rpx;
        height: 42rpx;
        font-size: 32rpx;
        font-family: PingFang SC, PingFang SC-500;
        font-weight: 500;
        text-align: LEFT;
        color: #000000;
        line-height: 38rpx;
    }

    .clow {
        display: flex;
        width: 100%;
        height: 260rpx;
        flex-direction: row;

        .clow1 {
            display: flex;
            margin-right: 48rpx;
            flex-direction: column;
            width: 414rpx;
            height: 258rpx;
            background: #f0f0f0;
            border-radius: 20rpx;

            .w-box1 {
                display: flex;
                height: 80rpx;
                margin: 28rpx 28rpx;
                flex-direction: row;

                .w-img {
                    width: 76rpx;
                    height: 78rpx;
                    background: #ffffff;
                    border-radius: 10rpx;
                    box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
                }

                .w-tit {
                    display: flex;
                    margin-left: 10rpx;
                    flex-direction: column;
                    width: 300rpx;
                    height: 78rpx;

                    .w-datit {
                        width: 202rpx;
                        height: 48rpx;
                        font-size: 28rpx;
                        font-family: PingFang SC, PingFang SC-500;
                        font-weight: 500;
                        text-align: LEFT;
                        color: #000000;
                        line-height: 32rpx;
                    }

                    .w-xitit {
                        width: 194rpx;
                        height: 48rpx;
                        font-size: 20rpx;
                        font-family: PingFang SC, PingFang SC-500;
                        font-weight: 500;
                        text-align: left;
                        color: #c0bfbf;
                        line-height: 24rpx;
                    }
                }
            }

            .w-box2,
            .w-box3 {
                display: flex;
                height: 40rpx;
                margin: 12rpx 28rpx;
                background: #ffffff;
                justify-content: center;
                align-items: center;
                font-size: 20rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: CENTER;
                color: #000000;
                line-height: 24rpx;
            }

            .w-box3 {
                margin-top: 5rpx;
            }
        }
    }

    // 发现圈子
    .fx-box {
        margin-top: 40rpx;
        display: flex;
        height: 70rpx;
        width: 100%;
        flex-direction: row;

        .fa-box {
            display: flex;
            height: 70rpx;
            width: 150rpx;
            align-items: center;
            text-align: left;
            font-size: 32rpx;
            font-family: PingFang SC, PingFang SC-500;
            font-weight: 500;
            text-align: left;
            color: #000000;
            line-height: 38rpx;
        }

        .xin-box {
            display: flex;
            margin-left: 250rpx;
            height: 70rpx;
            width: 220rpx;
            flex-direction: row;

            .xw-box {
                display: flex;
                margin-top: 18rpx;
                width: 36rpx;
                height: 36rpx;
                border-radius: 50%;
                border: 4rpx solid #f2bb16;
                color: #f2bb16;
                justify-content: center;
                align-items: center;
                font-size: 48rpx;
                font-weight: 50;
                // background: #e61a1a;
            }

            .xq-box {
                display: flex;
                margin-top: 18rpx;
                margin-left: 20rpx;
                height: 40rpx;
                width: 150rpx;
                font-size: 30rpx;
                justify-content: center;
                align-items: center;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: LEFT;
                color: #f2bb16;
                line-height: 36rpx;
            }
        }
    }

    // 热门圈子
    .clows {
        margin-top: 20rpx;
        display: flex;
        width: 100%;
        height: 280rpx;
        flex-direction: row;

        .clow1s {
            display: flex;
            flex-direction: column;
            margin-right: 56rpx;
            width: 402rpx;
            height: 258rpx;
            background: #f0f0f0;
            border-radius: 40rpx;

            .re-box1 {
                width: 402rpx;
                height: 72rpx;
                display: flex;
                flex-direction: row;
                background: #f2bb16;
                border-radius: 40rpx 40rpx 0rpx 0rpx;

                .re-box2 {
                    display: flex;
                    margin-top: 15rpx;
                    margin-left: 20rpx;
                    justify-content: center;
                    align-items: center;
                    width: 154rpx;
                    height: 48rpx;
                    font-size: 30rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: CENTER;
                    color: #ffffff;
                    line-height: 36rpx;
                }

                .reg-box {
                    display: flex;
                    margin-top: 10rpx;
                    margin-left: 170rpx;
                }
            }

            .re-box3 {
                display: flex;
                margin-top: 20rpx;
                height: 78rpx;
                width: 100%;
                flex-direction: row;

                .re1 {
                    display: flex;
                    width: 54rpx;
                    height: 54rpx;
                    margin-left: 20rpx;
                    background: #ffffff;
                    border-radius: 10rpx;
                    box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
                }

                .res {
                    margin-left: 30rpx;
                    height: 78rpx;
                    width: 300rpx;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    display: flex;

                    .re2 {
                        height: 40rpx;
                        width: 300rpx;
                    }

                    .re3 {
                        height: 40rpx;
                        width: 300rpx;
                        font-size: 20rpx;
                        font-family: PingFang SC, PingFang SC-500;
                        font-weight: 500;
                        text-align: left;
                        color: #c0bfbf;
                        line-height: 24rpx;
                    }
                }
            }

        }
    }

    // 进入圈子
    .bottnons-box {
        display: flexbox;
        flex-direction: column;
        margin-top: 48rpx;
        background: #f0f0f0;
        width: 630rpx;
        height: 260rpx;
        border-radius: 20rpx;

        .tops-box {
            display: flex;
            margin-top: 28rpx;
            height: 96rpx;
            width: 630rpx;
            flex-direction: row;

            .tu-z {
                margin-left: 56rpx;
                width: 76rpx;
                height: 78rpx;
                background: #ffffff;
                border-radius: 10rpx;
                box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0, 0, 0, 0.25);
            }

            .mid-z {
                display: flex;
                margin-left: 20rpx;
                height: 96rpx;
                width: 210rpx;
                flex-direction: column;

                .mid1-z {
                    width: 202rpx;
                    height: 48rpx;
                    font-size: 28rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: LEFT;
                    color: #000000;
                    line-height: 32rpx;
                }

                .mid2-z {
                    width: 194rpx;
                    height: 48rpx;
                    font-size: 20rpx;
                    font-family: PingFang SC, PingFang SC-500;
                    font-weight: 500;
                    text-align: left;
                    color: #c0bfbf;
                    line-height: 24rpx;
                }
            }

            .qu-z {
                margin-top: 40rpx;
                margin-left: 100rpx;
                width: 144rpx;
                height: 44rpx;
                background: #f2bb16;
                border-radius: 20rpx;
                justify-content: center;
                align-items: center;
                font-size: 28rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: CENTER;
                color: #ffffff;
                line-height: 44rpx;
            }
        }

        .tex {
            margin-top: 18rpx;
            height: 50rpx;

            .boton-box2 {
                display: flex;
                margin-left: 56rpx;
                width: 520rpx;
                height: 40rpx;
                background: #ffffff;
                border-radius: 10rpx;
                justify-content: center;
                align-items: center;
                font-size: 20rpx;
                font-family: PingFang SC, PingFang SC-500;
                font-weight: 500;
                text-align: CENTER;
                color: #000000;
                line-height: 24rpx;
            }
        }

    }

    .botos {
        margin-top: 40rpx;
        height: 40rpx;
        width: 100%;
        justify-content: center;
        align-items: center;
        font-size: 36rpx;
        color: #d9d9d9;
        text-align: center;
    }
}